<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
		
	<title>商品评价</title>
	<link rel="stylesheet" href="../css/mui.min.css"/>
	<link rel="stylesheet" href="../css/common.css" />
	<link rel="stylesheet" href="../iconfont/iconfont.css" />
	<style>
		.product {
			margin: 10px 0 20px 0;
			padding: 5px 0;
		}
		.product .thumbnail {
			text-align: center;
			vertical-align: middle;
		}
		.product .thumbnail img {
			max-width: 90%;
			max-height: 90%;
		}
		.product .star {
			clear: all;
			width: 100%;
			margin: 5px 0;
			padding: 10px 0 5px 0;
			display: block;
			border-top: 1px solid #D8D8D8;
			border-bottom: 1px solid #D8D8D8;
		}
		.product .star>li {
			margin: 0 5px;
			display: inline;
			list-style: none;
		}
		.product .star>li>i {
			font-size: 2em;
			color: #DDDDDD;
		}
		.product .star>li.active>i:before {
			color: #F44542;
		}
		.rank-row>div:first-child,
		.text-row>div:first-child,
		.image-row>div:first-child {
			margin-top: 10px;
			font-size: 1.1em;
		}
		
		.apply-select {
			display: none;
		}
		.apply-select > div {
			border-top: 1px solid #CCCCCC;
			font-size: 13px;
		}
		.apply-images > div img {
			max-height: 120px;
			min-height: 90px;
			width: 90%;
		}
		.apply-btn button {
			color: #fff;
			background: #FC3A2E;
		}
		.apply-images .icon-close {
			position: absolute;
			top: -20px;
			right: -10px;
			padding: 10px;
		}
	</style>
</head>
<body>
	<!-- 顶部导航 开始 -->
	<header class="header mui-bar mui-bar-nav bar mui-text-center">
		<a class="mui-pull-left mui-action-back pad-h-md">
			<i class="iconfont icon-back"></i>
		</a>
		<a class="title">商品评价</a>
	</header>
	<!-- 顶部导航 结束 -->
	
	<!--收货地址列表 开始-->
	<div class="mui-content container-pull-refresh no-pad">
		<div class="mui-scroll">
			<!--数据列表-->
			<section class="mui-table-view scroll-data" data-tpl="tpl-product">
			</section>
		</div>
	</div>
	<!--收货地址列表 结束-->
	
	<!-- 订单商品模板 开始 -->
	<script type="text/template" id="tpl-product">
		{{each data.extend as item}}
		<div class="mui-row product white" data-id="{{item.goods_id}}">
			<div class="mui-col-xs-3 thumbnail">
				<img src="{{item.thumb | thumb}}" />
			</div>
			<div class="mui-col-xs-9">
				<p class="no-mgn pad-h-md pad-v">{{item.title}}</p>
				<p></p>
				<p class="no-mgn pad-h-md text-primary">
					￥{{item.price | price}}
					<span class="mui-pull-right">x {{item.nums}}</span>
				</p>
			</div>
			<div class="mui-row rank-row pad-h">
				<div class="mui-col-xs-12">
					评分等级
				</div>
				<ul class="star mui-col-xs-12">
					<li><i class="icon iconfont icon-iconfontwujiaoxing"></i></li>
					<li><i class="icon iconfont icon-iconfontwujiaoxing"></i></li>
					<li><i class="icon iconfont icon-iconfontwujiaoxing"></i></li>
					<li><i class="icon iconfont icon-iconfontwujiaoxing"></i></li>
					<li><i class="icon iconfont icon-iconfontwujiaoxing"></i></li>
				</ul>
			</div>
			<div class="mui-row text-row pad-h">
				<div class="mui-col-xs-12">
					评论内容
				</div>
				<div class="mui-col-xs-12 pad-v-sm">
					<textarea name="4text" rows="3" class="no-rds" placeholder="请输入评论内容"></textarea>
				</div>
			</div>
			
			
			<div class="mui-row image-row">
				<div class="mui-col-xs-12 pad-h pad-v-sm bdr-b">
					晒图　<small>可以得优惠卷</small>
				</div>
				<div class="mui-col-xs-12">
					<div class="mui-row pad-v-md white apply-images pad-h-sm">
						<div class="mui-col-xs-4 mui-text-center btn-add-image">
							<img src="../image/tianjiatubiao.png" />
						</div>
					</div>
				</div>
			</div>
		</div>
		{{/each}}
		<div class="pad-v-sm"></div>
		<div class="mui-row mui-text-center pad-h-md">
			<button type="button" class="mui-btn mui-btn-block btn-submit" disabled="disabled">提交评论</button>
		</div>
		<div class="pad-v-md"></div>
	</script>
	<!-- 订单商品模板 结束 -->
	
	<!--上传图片模板 开始-->
	<script type="text/template" id="tpl-image">
		{{each data as item}}
		<div class="mui-col-xs-4 mui-text-center image-item" data-path="{{item}}">
			<img src="{{item | image}}" />
			<i class="icon iconfont icon-close"></i>
		</div>
		{{/each}}
	</script>
	<!--上传图片模板 结束-->
	
	<script type="text/javascript" src="../js/mui.min.js" ></script>
	<script type="text/javascript" src="../js/jquery.min.js" ></script>
	<script type="text/javascript" src="../js/jquery.ba-bbq.min.js"></script>
	<script type="text/javascript" src="../js/template.js" ></script>
	<script type="text/javascript" src="../js/jweixin-1.0.0.js" ></script>
	<script type="text/javascript" src="../js/app.js" ></script>
	<script type="text/javascript" src="product.comment.edit.js" ></script>
</body>
</html>